<template>
  <view class="container">
    <!-- 自定义头部 -->
    <BhTitle titleText="发布店铺" @clickBack="clickBack"></BhTitle>

    <view class="title">请认真完善以下发布店铺所需的资料</view>
    <view class="sub-title">为了能顺利通过，请上传真实有效的信息</view>
    <view class="info-wrap bh-row bh-justify-space-between">
      <view class="info-title-wrap bh-col bh-justify-center bh-align-start">
        <view class="info-title">指派给用户</view>
        <view class="info-sub-title">{{postDto.fakeUserDto ? postDto.fakeUserDto.nickName : '还未指定   '}}
          转铺贴：{{ postDto.fakeUserDto ? postDto.fakeUserDto.postNumber : '0' }}&nbsp;&nbsp;找铺贴：
          {{ postDto.fakeUserDto ? postDto.fakeUserDto.postBuyNumber : '0' }}</view>
      </view>
      <view class="info-btn" @click="fakeUser">
        {{ postDto.fakeUserDto ? '重新分配' : '分配' }}
      </view>
    </view>
    <view class="info-wrap bh-row bh-justify-space-between">
      <view class="info-title-wrap bh-col bh-justify-center bh-align-start">
        <view class="info-title">基本信息</view>
        <view class="info-sub-title">您店铺的基本信息每个找店人都会关注哦</view>
      </view>
      <view class="info-btn" @click="() => { navToPage('/PostPage/post_add_sell_fake/post_add_sell_fake_base') }">
        {{ finished('base') == 1 ? '修改' : '填写' }}
      </view>
    </view>
    <view class="info-wrap bh-row bh-justify-space-between">
      <view class="info-title-wrap bh-col bh-justify-center bh-align-start">
        <view class="info-title">商铺照片</view>
        <view class="info-sub-title">有照片的店铺比没有的关注度高10倍哦</view>
      </view>
      <view class="info-btn" @click="() => { navToPage('/PostPage/post_add_sell_fake/post_add_sell_fake_pic') }">
        {{ finished('pic') == 1 ? '重新上传' : '上传' }}
      </view>
    </view>
    <view class="other-wrap">
      <view class="other-title">加分项</view>
      <view class="other-item-wrap bh-row bh-justify-space-between">
        <!-- <view class="other-item-img">图片</view> -->
        <image src="../images/post_add/post_add_license.svg" mode="scaleToFill" class="other-item-img" />
        <view class="other-item-title">商铺证照</view>
        <!-- <view class="other-item-btn">添加</view> -->
        <image src="../images/post_add/post_add_addbtn.svg" mode="scaleToFill" class="other-item-btn" @click="() => { navToPage('/PostPage/post_add_sell_fake/post_add_sell_fake_license') }" />
      </view>

      <view class="other-item-wrap bh-row bh-justify-space-between">
        <!-- <view class="other-item-img">图片</view> -->
        <image src="../images/post_add/post_add_vedio.svg" mode="scaleToFill" class="other-item-img" />
        <view class="other-item-title">商铺视频</view>
        <image src="../images/post_add/post_add_addbtn.svg" mode="scaleToFill" class="other-item-btn" @click="() => { navToPage('/PostPage/post_add_sell_fake/post_add_sell_fake_video') }" />
      </view>

      <view class="other-item-wrap bh-row bh-justify-space-between">
        <image src="../images/post_add/post_add_chat.svg" mode="scaleToFill" class="other-item-img" />
        <view class="other-item-title">点评商铺</view>
        <image src="../images/post_add/post_add_addbtn.svg" mode="scaleToFill" class="other-item-btn" @click="() => { navToPage('/PostPage/post_add_sell_fake/post_add_sell_fake_feature') }" />
      </view>
    </view>
    <view :class="[finished('base') == 1 && finished('pic') == 1 ? 'publish-btn' : 'publish-btn publish-btn-inac']" @click="postAdd">
      发布我的店铺
    </view>
    <showCustomTips></showCustomTips>
  </view>
</template>

<script>
import { Api } from '../../api/api'
import { BackendApi } from '../../api/backend_api'
import check_utils from '../../components/custom_views/check_utils'
import { CustomTips } from '../../components/custom_views/custom_tips'
import showCustomTips from '../../components/custom_views/show-custom-tips.vue'
import { post_add_fake_mixin } from './post_add_fake_mixin'
export default {
  components: { showCustomTips },
  mixins: [post_add_fake_mixin],
  data() {
    let that = this
    return {
      ...post_add_fake_mixin.initData(that),
    }
  },
  computed: {},
  methods: {
    fakeUser(){
      let that = this
      BackendApi.v05_user_fakeGetrandomuser({}).then(res => {
        if(res.code == 200){
          that.postDto.fakeUserDto = {
            userId: res.data.userDto.userId,
            postNumber: res.data.postNumber,
            postBuyNumber: res.data.postBuyNumber,
            nickName: res.data.userDto.nickName,
          }
          uni.setStorageSync('post_sell_draft', JSON.stringify(that.postDto))
        }else{
          check_utils.showCustToast(res.msg)
        }
      })
    },
    clickBack() {
      this.$store.commit('updateMyPostOfEditingSell', {})
      let postDtoJson = uni.getStorageSync('post_sell_draft')
      if (postDtoJson) {
        let toUpdate = JSON.parse(postDtoJson)
        toUpdate.fakeUserDto = undefined
        uni.setStorageSync('post_sell_draft', JSON.stringify(toUpdate))
      }
      uni.setStorageSync('post_sell_draft', JSON.stringify(that.postDto))
    }
  },
  watch: {},

  // 页面周期函数--监听页面加载
  onLoad(options) {
    let that = this
    if (options.postId) {
      // 编辑状态设置到缓存中。
      Api.PostApi.detail(options.postId, (res) => {
        if (res.code == 200) {
          res.data.sourceId = options.postId
          res.data.id = null
          that.$store.commit('updateMyPostOfEditingSell', res.data)
          that.postDto = res.data
        }
      })
    } else {
      this.postDto = post_add_fake_mixin.initData(that).postDto

      // 发布数量最多10个。
      // if (this.$store.state.sessionDto.postNumber >= 10) {
      if (false) {
        this.showCustomTips({
          title: '温馨提示',
          content: CustomTips.tipsPostAddReachMaxCount(10),
          confirmText: '确定',
          confirmColor: '',
          cancelText: '',
          success(res) {
            if (res.confirm) {
              uni.redirectTo({
                url: '/pages/home/home'
              })
            }
          }
        })
      } else {
        Api.PostSellApi.postOfInit(that, (res) => {
          if (res.code == 200) {
            if (res.data.records && res.data.records.length > 0) {
              this.showCustomTips({
                title: '温馨提示',
                content: CustomTips.tipsBeforeAuditFinish,
                confirmText: '确定',
                confirmColor: '',
                cancelText: '',
                success(res) {
                  if (res.confirm) {
                    uni.redirectTo({
                      url: '/pages/home/home'
                    })
                  }
                }
              })
            }
          } else {
            check_utils.showCustToast(res.msg)
            uni.redirectTo({
              url: '/pages/home/home'
            })
          }
        })
      }

    }

  },
  // 页面周期函数--监听页面初次渲染完成
  onReady() { },
  // 页面周期函数--监听页面显示(not-nvue)
  onShow() {
    let that = this
    if (that.$store.state.myPostOfEditingSell && that.$store.state.myPostOfEditingSell.sourceId) {
      that.postDto = that.$store.state.myPostOfEditingSell
    } else {
      this.postDto = post_add_fake_mixin.initData(that).postDto
    }

  },
  // 页面周期函数--监听页面隐藏
  onHide() { },
  // 页面周期函数--监听页面卸载
  onUnload() { },
  // 页面处理函数--监听用户下拉动作
  // onPullDownRefresh() { uni.stopPullDownRefresh(); },
  // 页面处理函数--监听用户上拉触底
  // onReachBottom() {},
  // 页面处理函数--监听页面滚动(not-nvue)
  // onPageScroll(event) {},
  // 页面处理函数--用户点击右上角分享
  // onShareAppMessage(options) {},
}
</script>

<style scoped lang="scss">
@import url(../../static/css/base.css);

page {
  height: 100vh;
}

.container {
  background-color: #F5F9FA;
  width: 100%;
  height: 100vh;
}

.title {
  padding-left: 48rpx;
  padding-top: 32rpx;

  font-size: 32rpx;
  font-weight: 600;
  color: rgba(0, 0, 0, 0.85);
}

.sub-title {
  margin-left: 48rpx;
  margin-top: 24rpx;

  font-size: 24rpx;
  font-weight: normal;

  color: #999999;
}

.info-wrap {
  margin-left: 32rpx;
  margin-right: 32rpx;
  margin-top: 32rpx;
  // width: 343px;
  // height: 160rpx;
  border-radius: 16rpx;
  background: #FFFFFF;
  box-sizing: border-box;
  border: 1rpx solid rgba(0, 0, 0, 0.85);

  .info-title-wrap {
    .info-title {
      margin-left: 32rpx;
      margin-top: 32rpx;
      // width: 71px;
      // height: 18px;
      // opacity: 1;

      // font-family: Alibaba PuHuiTi 2.0;
      font-size: 36rpx;
      font-weight: 600;
      text-align: center;

      color: rgba(0, 0, 0, 0.85);
    }

    .info-sub-title {
      margin-left: 32rpx;
      margin-top: 24rpx;
      margin-bottom: 44rpx;

      font-size: 24rpx;
      font-weight: normal;

      color: #9E9E9E;
    }
  }

  .info-btn {
    margin-right: 32rpx;
    padding: 16rpx 36rpx;
    // top: 188px;
    // width: 64px;
    // height: 24px;
    border-radius: 200rpx;

    background: #F8D247;

    font-size: 28rpx;
    font-weight: 600;

    color: rgba(0, 0, 0, 0.85);
  }
}

.other-wrap {
  margin-left: 32rpx;
  margin-right: 32rpx;
  margin-top: 48rpx;
  // width: 343px;
  // height: 334px;
  border-radius: 16rpx;

  background: linear-gradient(180deg, #F8D247 -27%, #FFFFFF 84%);

  .other-title {
    margin-top: 28rpx;
    margin-left: 20rpx;
    font-size: 32rpx;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.85);
  }

  .other-item-wrap {
    margin-left: 20rpx;
    margin-right: 20rpx;
    margin-top: 36rpx;
    // top: 406px;
    // width: 323px;
    height: 160rpx;
    border-radius: 16rpx;

    background: #FFFFFF;

    .other-item-img {
      margin-left: 48rpx;
      width: 40rpx;
      height: 40rpx;
      opacity: 1;
    }

    .other-item-title {
      margin-left: 32rpx;
      flex: 1;
      font-size: 36rpx;
      font-weight: 600;

      color: rgba(0, 0, 0, 0.85);
    }

    .other-item-btn {
      width: 32rpx;
      height: 32rpx;
      margin-right: 64rpx;
    }
  }
}

.publish-btn {
  margin-top: 28rpx;
  width: 612rpx;
  // height: 112rpx;
  border-radius: 48px;

  background: #F8D247;
  margin: auto;
  margin-top: 28rpx;
  text-align: center;
  align-items: center;
  padding-top: 42rpx;
  padding-bottom: 42rpx;

  font-size: 32rpx;
  font-weight: 600;

  color: rgba(0, 0, 0, 0.85);
}

.publish-btn-inac {
  background: #ddd;
}
</style>